import 'dart:io';
import 'package:image_picker_plus_nic/src/custom_packages/preview_image.dart';
import 'package:image_picker_plus_nic/src/entities/app_theme.dart';
import 'package:image_picker_plus_nic/src/custom_packages/crop_image/crop_image.dart';
import 'package:flutter/material.dart';

// 預覽view
class PreviewImageView extends StatefulWidget {
  final ValueNotifier<GlobalKey<CustomCropState>> cropKey;
  final ValueNotifier<List<int>> indexOfSelectedImages;

  final ValueNotifier<bool> multiSelectionMode;
  final ValueNotifier<bool> expandImage;
  final ValueNotifier<double> expandHeight;
  final ValueNotifier<bool> expandImageView;

  /// To avoid lag when you interacting with image when it expanded
  final ValueNotifier<bool> enableVerticalTapping;
  final ValueNotifier<File?> selectedImage;

  final VoidCallback clearMultiImages;

  final AppTheme appTheme;
  final ValueNotifier<bool> noDuration;
  final Color whiteColor;
  final double? topPosition;

  const PreviewImageView({
    Key? key,
    required this.indexOfSelectedImages,
    required this.cropKey,
    required this.multiSelectionMode,
    required this.expandImage,
    required this.expandHeight,
    required this.clearMultiImages,
    required this.expandImageView,
    required this.enableVerticalTapping,
    required this.selectedImage,
    required this.appTheme,
    required this.noDuration,
    required this.whiteColor,
    this.topPosition,
  }) : super(key: key);

  @override
  State<PreviewImageView> createState() => _PreviewImageViewState();
}

class _PreviewImageViewState extends State<PreviewImageView> {
  @override
  Widget build(BuildContext context) {
    return ValueListenableBuilder(
      valueListenable: widget.selectedImage,
      builder: (context, File? selectedImageValue, child) {
        //print('selectedImageValue=$selectedImageValue');
        if (selectedImageValue != null) {
          return showSelectedImage(context, selectedImageValue);
        } else {
          return Container(key: GlobalKey(debugLabel: "do not have"));
        }
      },
    );
  }

  Container showSelectedImage(BuildContext context, File selectedImageValue) {
    double width = MediaQuery.of(context).size.width;
    return Container(
      key: GlobalKey(debugLabel: "have image"),
      color: widget.whiteColor,
      height: 480,
      width: width,
      child: ValueListenableBuilder(
        valueListenable: widget.multiSelectionMode,
        builder: (context, bool multiSelectionModeValue, child) => Stack(
          children: [
            ValueListenableBuilder(
              valueListenable: widget.expandImage,
              builder: (context, bool expandImageValue, child) =>
                  previewImageWidget(selectedImageValue, expandImageValue),
            ),
          ],
        ),
      ),
    );
  }

  // 預覽 widget
  Widget previewImageWidget(File selectedImageValue, bool expandImageValue) {
    GlobalKey<CustomCropState> cropKey = widget.cropKey.value;
    String path = selectedImageValue.path;
    bool isThatVideo = path.contains("mp4", path.length - 5);
    //print('previewImageWidget()');
    return Container(
      color: Colors.white,
      child: CustomPreview(
        image: selectedImageValue,
        isThatImage: !isThatVideo,
        key: cropKey,
        paintColor: widget.appTheme.primaryColor,
        aspectRatio: expandImageValue ? 6 / 8 : 1.0,
      ),
    );
  }
}
